<template>
	<layer-box ref="layer" overlay-style="background: rgba(0, 0, 0, 0.50);backdrop-filter: blur(8.3px);" width="460px" height="360px">
		<view class="content">
			<uv-text text="在线客服" color="#fff" size="24px" align="center" margin="46px 0 0"></uv-text>
			<uv-text text="使用微信扫一扫登录" color="#BABAD8" size="16px" align="center" margin="6px 0 22px"></uv-text>
			<view class="list uv-flex-row">
				<view class="item">
					<image
						src="https://s3-alpha-sig.figma.com/img/b129/6bfb/b90dbfc4992be91f81e285ae6ad79501?Expires=1722816000&Key-Pair-Id=APKAQ4GOSFWCVNEHN3O4&Signature=qiVCrdUqwcY7ahS6iHG~gKioZztZqcWv9FVnG57gbsYxeSnbWC2y---ZI6sRuMKq8PRCLBzfA8iMG266hDC2Iy-GXRhvpJ~XAodXrh6I4cSc6uwkBMmlFgNXY6qe5dbQgOTZ4EdjyR-YkJQ2hMNGZ~61Pw0qCemNGlhzAdr~vko7bGGOfJwhcKsKg3SM-D7wn6vZ3DdeSfd9P7K0rvK~vP3ZGQCffgpqpxvqVCI2d3-9ifmLVIA7RdnY~4eT5gPp6TrS7~M3lp27E2cpqIeriu8Gn4iIOYz0fKCOzZEiYTgi1VUs9LPPEQSCyXQFU8SIDMeTg8zyGm-LpH-NpTj9MQ__"
						mode="aspectFill"></image>
					<uv-text :text="`关注 ${name} 公众号`" color="#BABAD8" size="16px" align="center" margin="10px 0"></uv-text>
				</view>
			</view>
		</view>
	</layer-box>
</template>
<script setup>
	import { ref, computed } from 'vue';
	const layer = ref(null);
	const name = computed(() => {
		return getApp().globalData.dzInfo.name;
	})

	function open() {
		layer.value.open();
	}

	function close() {
		layer.value.close();
	}
	defineExpose({ open, close });
</script>
<style scoped lang="scss">
	.list {
		justify-content: center;
		.item {
			font-size: 0;
			text-align: center;
			image {
				width: 145px;
				height: 145px;
				border-radius: 8px;
				border: 2px solid #5F5F70;
			}
		}
	}
</style>